<template>
  <div class="img-box" :style="{width:width+'px',height:height+'px'}">
    <img :src="src||DefaultImg" :style="{borderRadius:radius+'%'}" alt="">
  </div>
</template>

<script>
import DefaultImg from '@/assets/default.jpg'
export default {
  name: 'WishImage',
  props: {
    src: { type: String, default: '' },
    width: {
      type: [Number, String],
      default: 100
    },
    height: {
      type: [Number, String],
      default: 100
    },
    radius: {
      type: [Number, String],
      default: 0 // 百分比
    }
  },
  data() {
    return {
      DefaultImg
    }
  }
}
</script>

<style lang="scss">
  .img-box{
    display: flex;
    align-items: center;
    justify-content: center;
    img{
      display: block;
      max-width: 100%;
      max-height: 100%;
    }
  }
</style>
